<!DOCTYPE html>
<html lang="zh-cmn-Hans" class="g-plat-pc" style="font-size: 80px">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>画加平台，一站式美术约稿</title>

    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
    <link href="css/index.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

</head>
<body>
<header><h1 style="font-size: 0">画加平台，一站式美术约稿</h1></header>
<div id="header" class="header-wraper">
    <div class="header header-opacity">
        <div class="header-cont">
            <!--首页及分类-->
            <div class="header-logo">
                <a href="home.html" title="首页">
                    <img style="margin-top: -2px;" src="images/logo-white.svg" width="111" height="31">
                </a>
            </div>
            <ul class="nav">
                <li class="on"><a href="home.html">首页</a></li>
                <li v-for="c in category_arr"><a :href="'home.html?cid='+c.id"  v-text="c.name">约稿</a></li>
            </ul>
            <div class="header-extra">
                <div class="scope-item">
                    <div class="w-Search w-Search_on" id="j_search-widget" style="margin-left: auto;">
                        <input type="text" placeholder="搜索画师" maxlength="20">
                        <i class="icon icon_search" style="cursor: pointer;"></i>
                    </div>
                    <div class="w-Hot-search j_hot-search"><h3>热门搜索</h3>
                        <p><a href="javascript:;">周边</a><a href="javascript:;">周边设计</a><a href="javascript:;">周边</a><a
                                href="javascript:;">周边设计</a></p></div>
                </div>
                <div class="scope-item scope-language">
                    <div class="language-text">CN</div>
                    <!--这是一个下拉会话式弹出层,无法选择英文显示,因此注释-->
                    <div class="language-list g-fade-in">
                        <!--                        <div class="w-Radiogroup js-language" data-value="CN"><span data-value="CN" class="on"><i-->
                        <!--                                class="icon icon_radio"></i>CN - 简体中文</span> <span data-value="EN"><i-->
                        <!--                                class="icon icon_radio"></i>EN - English<i class="icon icon_beta"></i></span></div>-->
                    </div>
                </div>
                <div class="header-entry"><a href="javascript:;" class="i_Btn js-login">登录 / 注册</a></div>
            </div>
        </div>
    </div>
</div>
<div id="app" class="main">
    <div class="p-index white" style="margin-top: -80px">
        <!--轮播图开始-->
        <div id="myCarousel" class="carousel slide">
            <!-- 轮播（Carousel）指标 -->
            <ol class="carousel-indicators">
                <li  v-for="(b,i) in banner_arr" data-target="#myCarousel" :data-slide-to="i" :class="i==0?'active':''"></li>
            </ol>
            <!-- 轮播（Carousel）项目 -->
            <div class="carousel-inner">
                <!--(b,i)  i代表遍历下标,然后加属性条件,用三目判断为首个显示图片时,在class上加上active显示-->
                <div v-for="(b,i) in banner_arr" class="item" :class="i==0?'active':''">
                    <img :src="b.imgurl" alt="First slide" style="width: 100%">
                    <div class="carousel-caption"></div>
                </div>
            </div>
            <!-- 轮播（Carousel）导航 -->
            <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>
        </div>
        <!--轮播图结束-->

        <!--这是中间内容,-->
        <div id="callboard" class="index-special index-container">
            <div v-for="call in callboard_arr" class="special-item">
                <a href="public.html" style="text-decoration: none">
                    <img :src="call.imgurl" class="special-image" alt="" width="100%">
                    <p class="t_Ellipsis" v-text="call.title"></p></a>
            </div>
        </div>

        <!--中下内容,背景灰色,三个推荐模块-->
        <div id="excellent" class="index-main">
            <!--优秀作品推荐开始-->
            <div class="index-recommend-works index-container">
                <div class="index-title"><h2>优秀作品推荐</h2>
                    <p>涵盖各式画风的优秀作品</p></div>
                <ul class="works-list">
                    <li v-for="v in view_arr" class="works-item">
                        <div class="works-tag tag-color-1" v-text="v.style"></div>
                        <div class="works-image js-works" data-id="jBejeGqE" style="overflow: hidden">
                            <img :src="v.imgurl" class="works-image js-works">
                        </div>
                        <div class="works-author js-artist" data-id="a5rlXWrV">
                            <i class="author-avatar">
                                <img :src="v.iconurl" class="author-avatar"></i>
                            <a class="author-name a_Black t_Ellipsis" v-text="v.author"></a>
                        </div>
                    </li>
                </ul>
            </div>
            <!--优秀作品推荐结束-->
            <!--最新作品推荐开始-->
            <div class="index-new-works index-container">
                <div class="index-title"><h2>最新作品推荐</h2>
                    <p>最近一周的作品推荐</p></div>
                <div class="works-list-wrap">
                    <div class="works-change js-works-change"><i class="icon icon_change"></i> <span>换一批</span></div>
                    <ul class="works-list js-work-list">
                        <li v-for="n in new_arr" class="works-item">
                            <div class="works-image js-works" data-id="MBm022J8">
                                <img :src="n.imgurl" class="works-image js-works" style="align-content: center">
                            </div>
                            <div class="works-author js-artist" data-id="KEvpVRV8">
                                <i class="author-avatar">
                                    <img :src="n.iconurl" class="author-avatar">
                                </i>
                                <a class="author-name a_Black t_Ellipsis" v-text="n.author"></a>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <!--最新作品推荐结束-->
            <!--画师推荐开始-->
            <div class="index-recommend-artists index-container">
                <div class="index-title"><h2>优质画师推荐</h2>
                    <p>画加小编精挑细选优质画师</p></div>
                <ul class="artist-list">
                    <li v-for="ur in user_arr" class="artist-item js-artist" data-id="L8J35OJB">
                        <div class="artist-author"
                             style="background-image:url(images/artist.png)">
                            <div class="artist-bg">
                                <div class="artist-cap"></div>
                                <div class="artist-avatar"><img :src="ur.headurl"></div>
                                <div class="artist-name" v-text="ur.name"></div>
                                <div class="artist-info"><p class="artist-role t_Right" v-text="ur.role">资深原画师</p>
                                    <p class="artist-wb">微博粉丝<span v-text="ur.fans">32501</span></p></div>
                                <ul class="artist-tags">
                                    <li>厚涂</li>
                                    <li>日系</li>
                                    <li>韩系</li>
                                    <li>插画</li>
                                </ul>
                            </div>
                        </div>
                        <div class="artist-decs"><p class="artist-intro"><i class="icon icon_quotation"></i>
                            <span v-text="ur.introl">就职于网易，擅长各类风格、角色原画设计、擅长卡牌、插图、壁纸、kv等。</span>
                        </p></div>
                    </li>
                </ul>
            </div>
            <!--画师推荐结束-->
            <!--页底需求方轮播图-->
            <div id="footCarousel" class="index-custom index-container js-custom">
                <div class="index-title"><h2>优质需求方推荐</h2>
                    <p>您熟悉的优质需求方也在使用画加</p></div>
                <div class="custom-wrap">
                    <ul class="custom-list custom-animation" style="transform: translateX(-245.2px);">
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/five)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">20</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">25</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">第五人格宣传约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/fire)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">22</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">25</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">决战平安京插画约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/untamed)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">6</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">5</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">陈情令宣传约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/bing)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">5</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">7</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">率土之滨kv约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/five)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">20</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">25</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">第五人格宣传约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/fire)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">22</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">25</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">决战平安京插画约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/untamed)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">6</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">5</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">陈情令宣传约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/bing)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">5</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">7</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">率土之滨kv约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/five)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">20</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">25</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">第五人格宣传约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/fire)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">22</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">25</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">决战平安京插画约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/untamed)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">6</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">5</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">陈情令宣传约稿</p></div>
                        </li>
                        <li class="custom-item">
                            <div class="custom-image"
                                 style="background-image: url(images/bing)"></div>
                            <div class="custom-info">
                                <div class="info-item"><p class="info-name">发布约稿</p>
                                    <p class="info-count">5</p></div>
                                <div class="info-line"></div>
                                <div class="info-item"><p class="info-name">合作画师</p>
                                    <p class="info-count">7</p></div>
                            </div>
                            <div class="custom-project"><p class="project-status"><img
                                    src="">正在约稿
                            </p>
                                <p class="project-name t_Ellipsis">率土之滨kv约稿</p></div>
                        </li>
                    </ul>
                </div>
                <div class="custom-switcher">
                    <i class="switcher-left js-prev-custom"></i>
                    <i class="switcher-right js-next-custom"></i>
                </div>
            </div>
        </div>
        <div class="copyright">
            <div class="copyright-cont">
                <div class="scope-p1">
                    <a href="javascript:;" class="a_White" dialog-title="联系我们">联系我们</a>
                    <a href="javascript:;" class="a_White" dialog-title="建议反馈">建议反馈</a>
                    <a href="javascript:;" class="a_White" link-to="/doc/service-agreement">服务协议</a>
                    <a href="javascript:;" class="a_White" link-to="/doc/join-us">加入我们</a>
                    <a href="javascript:;" class="a_White" dialog-title="画加画师QQ群">画加画师QQ群</a>
                    <!--                    <div class="l_Right">-->
                    <!--                        <i class="icon icon_weibo"></i>-->
                    <!--                    </div>-->
                </div>
                <div class="scope-p2">
                    <div class="scope-p3">
                        <a href="javascript:;" class="a_White" link-to="/doc/user-guide">平台使用攻略</a>
                        <span class="split">/</span>
                        <a href="javascript:;" class="a_White" link-to="/doc/operative-norm">约稿行为规范</a>
                        <span class="split">/</span>
                        <a href="javascript:;" class="a_White" link-to="/doc/dispute-terms">违规及争议处理办法</a>
                        <span class="split">/</span>
                        <a href="javascript:;" class="a_White" link-to="/doc/faq-terms">常见问题FAQ</a>
                        <a href="https://comic.jianghu.163.com/" target="_blank" class="scope-jianghu">
                            <img src="images/32">一梦江湖漫画馆<span>&gt;</span></a>
                        <a href="https://comic.163.com/" target="_blank" class="scope-yys">
                            <img src="images/32(1)">阴阳师漫画屋<span>&gt;</span></a>
                    </div>
                    <div class="scope-p4">
                        <div class="scope-left">
                            <p>工信部ICP备案号：
                                <a class="a_White" target="_blank" href="https://beian.miit.gov.cn/">浙B2-20090185-14</a>
                            </p>
                            <p>公安部门网站联网备案号：
                                <a class="a_White" target="_blank"><i class="icon icon_copyright"></i>浙公网安备
                                    33010802010201号</a>
                            </p>
                        </div>
                        <div class="scope-right">Copyright © 2021 ihuajia.cn 保留所有权利</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="left-side" class="fixed-bar left-side" style="display: block;">
    <div class="qrCode app-qrCode">画加APP</div>
    <div class="qrCode minProgram-qrCode">画加小程序</div>
    <a href="javascript:;" class="close-btn" title="关闭">×</a>
</div>

<!--作者详情页开始-->
<div class="work-window c-popup-artist js-artist-work-window" style="z-index: 2017;">
    <a href="home.html" class="window-close js-close" title="关闭"><i class="icon icon_close"></i></a>
    <div class="area">
        <div class="col1">
            <div class="shadow-box" style="box-shadow: none;">
                <div class="page-title-tabs-extra">
                    <div class="scope-tab js-tab">
                        <h2 class="on" data-id="works-container">TA的作品</h2>
                        <h2 data-id="apply-container" class="">TA的约稿</h2>
                    </div>
                </div>
                <div>
                    <div id="works-container" style="">

                        <div class="list-filters">
                            <div class="filters-item">
                                <h4>风格</h4>
                                <div class="w-Radiogroup js-style js-fold2" data-value="">

                                    <span data-value="" class="on">全部</span>

                                    <span data-value="国风">国风(7)</span>

                                    <span data-value="原創">原創(5)</span>

                                    <span data-value="插画">插画(5)</span>

                                    <span data-value="日系">日系(3)</span>

                                    <span data-value="其他">其他(3)</span>

                                    <span data-value="CG">CG(2)</span>

                                    <span data-value="阴阳师">阴阳师(2)</span>

                                    <span data-value="绘本">绘本(1)</span>

                                    <span data-value="山河表里">山河表里(1)</span>

                                </div>
                            </div>
                        </div>

                        <div class="works-cont js-works-cont">
                            <div class="works-list waterfall-container" id="j_artist_works-list"
                                 style="position: relative; height: 697.203px;">
                                <div class="work-item animationend" data-id="VEgeK3m8" data-index="8"
                                     style="animation-delay: 0ms; position: absolute; left: 5px; top: 0px;">
                                    <img class="js-img" :src="works.imgurl" width="200" height="126.21199671322924">
                                </div>
                            </div>

                        </div>
                    </div>
                    <!--这里是标签页,未实现-->
                    <div id="apply-container" style="display: none;">
                        <ul class="apply-list apply-list_small waterfall-container" id="js-apply-list" style="position: relative; height: 0px;"></ul>
                        <div id="waterfall-loading"></div>
                        <div id="waterfall-message" style="text-align:center;color:#999;">
                            <div class="empty"><h3>暂无约稿</h3></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col2" style="top: 95px;">
            <div class="shadow-box" style="box-shadow: none;">
                <div class="c_Gray f_12px">ID: L8J66a8N</div>
                <div class="blank10"></div>
                <div class="user-card js-user-card">
                    <img :src="works.iconurl" width="62" height="62" class="user-thum">
                    <h3><span v-text="works.author" :title="works.author">何何舞</span></h3>
                    <div>

                        <span class="user-tag c_DGray" style="background-color:#e5f8fa"><i class="icon" style="background-image:url(https://huajia-pub.nos-eastchina1.126.net/res/SwE-hvdlH5ep-8VvHLTSXcog9Q20QMdS)"></i>认证画师</span>

                    </div>
                    <div class="blank10"></div>
                    <div class="scope-data">
                        <a href="javascript:;" link-to="/arts/list?tab=follower&amp;uid=L8J66a8N" title="粉丝">
                            <font class="c_DGray">粉丝</font><br><font class="c_Black" v-text="user.fans">1459</font></a>
                        <a class="c_Gray">|</a>
                        <a href="javascript:;" link-to="/arts/list?tab=follow&amp;uid=L8J66a8N" title="关注"><font
                                class="c_DGray">关注</font><br><font class="c_Black">0</font></a>
                    </div>


                    <!-- 有简介显示以下 -->
                    <div class="f_Lineheight scope-desc" v-text="user.introl">已出版个人画集《夜想花》，《墨涧花》，《鹘》等，参与项目：《魔道祖师》动画等</div>


                    <div class="blank10"></div>
                    <div class="btn-big">

                        <a href="javascript:;" class="i_Btn i_Btn_small i_Btn_main_hollow2 js-follow"
                           data-value="false"><i class="icon icon_follow"></i>关注</a>

                        <a href="javascript:;" class="i_Btn i_Btn_small i_Btn_main_hollow2 js-invite">邀请</a>
                    </div>

                </div>
            </div>
            <div class="blank20"></div>
            <div class="shadow-box" style="box-shadow: none;">
                <div class="page-title-tabs-extra">
                    <div class="scope-tab js-tab">
                        <h3 class="on" data-id="demand-container">来自需求方的评价</h3>
                        <h3 data-id="artist-container" class="">来自画师的评价</h3>
                    </div>
                </div>
                <div>
                    <div id="demand-container" style="">

                        <!-- 有评分数据显示以下 -->
                        <div class="user-score">
                            <ul>

                                <li>
                                    <label>画稿质量</label>
                                    <div>
                                        <!-- 分数乘以20，换算成宽度百分比 -->
                                        <p style="width:100%"></p>
                                    </div>
                                    <strong>5.0</strong>
                                </li>

                                <li>
                                    <label>沟通能力</label>
                                    <div>
                                        <!-- 分数乘以20，换算成宽度百分比 -->
                                        <p style="width:100%"></p>
                                    </div>
                                    <strong>5.0</strong>
                                </li>

                                <li>
                                    <label>响应速度</label>
                                    <div>
                                        <!-- 分数乘以20，换算成宽度百分比 -->
                                        <p style="width:100%"></p>
                                    </div>
                                    <strong>5.0</strong>
                                </li>

                            </ul>
                        </div>

                    </div>
                    <div id="artist-container" style="display: none;">

                        <!-- 若无评分则显示以下 -->
                        <div class="empty">暂未获得任何评价</div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--作者详情页结束-->
</body>
<script type="text/javascript" src="../bootstrap3/jquery.min.js"></script>
<script type="text/javascript" src="../bootstrap3/js/bootstrap.js"></script>
<script type="text/javascript" src="../bootstrap3/js/holder.js"></script>
<script type="text/javascript" src="../bootstrap3/js/html5shiv.min.js"></script>
<script type="text/javascript" src="../bootstrap3/js/css3-mediaqueries.js"></script>
<script type="text/javascript" src="../bootstrap3/js/respond.min.js"></script>
<script src="js/header.js"></script>
<script src="js/banner.js"></script>
<script src="js/callboard.js"></script>
<script src="js/works.js"></script>
<script src="js/detail.js"></script>
</html>